<template>
    <div class="main-container" id="main-container">
    <div style="background-color: #fff;height:100%"  id="ClothChecking"> 
            <a-tabs   :lazy-load="true" type="card"  @change="tabsChange"  >
                <!-- <a-tab-pane title="扫码坯布" key="1">
                            <div style="min-height: 100px">
                                <ScanningGreyCloth></ScanningGreyCloth>
                            </div>
                    </a-tab-pane> -->
                    <!-- <a-tab-pane title="扫码坯布(固定)" key="1">
                            <div style="height: 100%;">
                                <ScanningGreyCloth1></ScanningGreyCloth1>
                            </div>
                    </a-tab-pane> -->
            </a-tabs>
        </div>
   
    </div>
</template>

<script lang="ts">
 
import { defineComponent,reactive, ref } from 'vue'

import emitter from '@/hooks/useEventBus'
   export default defineComponent({
       name:'masterDataSettings',
       setup(){
     
       const pageData = reactive({
            tableIndex:"1"
       })

  
       const tabsChange = (e:string|number)=>{
           pageData.tableIndex = e as string
           if (e === '1') {
                emitter.emit('refresh-ScanningGreyCloth')
            }  
       }
        return{
            pageData,
            tabsChange
        }
       }
   })
</script>
<style scoped>
    .main-container{
        height: 100%;
    }
    :deep(.ag-cell) {
    border-right: 1px solid #dde2eb;
}

:deep(.ag-header-cell) {
    border-right: 1px solid #dde2eb;
}
</style>